<template>
  <view class="container">
    <view class="example" style="width: 100%;height: 100%;border-radius: 1%;background-color: #eeeeee">
      <uni-forms ref="form" :model="this.marketers" labelWidth="80px" v-if="this.Echo==2">
        <uni-forms-item class="item1" name="applyId" hidden>
          <uni-easyinput v-model="marketers.applyId" hidden/>
        </uni-forms-item>
        <uni-forms-item class="item1" label="店铺名称" name="shopName">
          <uni-easyinput v-model="marketers.shopName" placeholder="请输入店铺名称"/>
        </uni-forms-item>
        <uni-forms-item class="item1" label="上传logo" name="shopLogo">
          <img class="item2" @click="chooseImage(1)" :src="marketers.shopLogo"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="商家负责人" name="shopUser">
          <uni-easyinput v-model="marketers.shopUser" placeholder="请输入商家负责人"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="主要产品" name="mainProducts">
          <uni-easyinput v-model="marketers.mainProducts" placeholder="请输入主要产品"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="店铺地址" name="shopUrl">
          <uni-easyinput v-model="marketers.shopUrl" placeholder="请输入店铺地址"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="详细地址" name="shopAddress">
          <uni-easyinput v-model="marketers.shopAddress" placeholder="请输入详细地址"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="店铺简介" name="shopIntroduction">
          <uni-easyinput v-model="marketers.shopIntroduction" placeholder="请输入店铺简介"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="银行开户名" name="bankAccountName">
          <uni-easyinput v-model="marketers.bankAccountName" placeholder="请输入银行开户名"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="银行账号" name="bankAccount">
          <uni-easyinput v-model="marketers.bankAccount" placeholder="请输入银行开户名"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="开户行支行名称" name="subBranch">
          <uni-easyinput v-model="marketers.subBranch" placeholder="请输入银行开户名"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="支行联行号" name="lineNumber">
          <uni-easyinput v-model="marketers.lineNumber" placeholder="请输入银行开户名"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="法人姓名" name="legalPersonName">
          <uni-easyinput v-model="marketers.legalPersonName" placeholder="请输入法人姓名"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="法人证件号" name="legalPersonDocument">
          <uni-easyinput v-model="marketers.legalPersonDocument" placeholder="请输入法人证件号"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="法人身份证照片" name="legalPersonImage">
          <img class="item2" @click="chooseImage(2)" :src="marketers.legalPersonImage"  >
        </uni-forms-item>
        <uni-forms-item class="item1" label="公司名称" name="corporateName">
          <uni-easyinput v-model="marketers.corporateName" placeholder="请输入公司名称"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="公司地址" name="corporateUrl">
          <uni-easyinput v-model="marketers.corporateUrl" placeholder="请输入公司地址"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="公司详细地址" name="corporateAddress">
          <uni-easyinput v-model="marketers.corporateAddress" placeholder="请输入公司详细地址"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="员工总数" name="corporateCount">
          <uni-easyinput v-model="marketers.corporateCount" placeholder="请输入员工总数"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="公司电话" name="corporatePhone">
          <uni-easyinput v-model="marketers.corporatePhone" placeholder="请输入公司电话"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="注册资金" name="registeredCapital">
          <uni-easyinput v-model="marketers.registeredCapital" placeholder="请输入注册资金"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="联系人姓名" name="contactName">
          <uni-easyinput v-model="marketers.contactName" placeholder="请输入公司电话"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="联系人电话" name="contactPhone" >
          <uni-easyinput v-model="marketers.contactPhone" placeholder="请输入联系人电话"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="公司邮箱" name="contactEmail">
          <uni-easyinput v-model="marketers.contactEmail" placeholder="请输入公司邮箱"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="营业执照号" name="licenseNumber">
          <uni-easyinput v-model="marketers.licenseNumber" placeholder="请输入联系人电话"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="法定经营范围" name="businessScope">
          <uni-easyinput v-model="marketers.businessScope" placeholder="请输入法定经营范围"  />
        </uni-forms-item>
        <uni-forms-item class="item1" label="营业执照电子版" name="shopELicense">
          <img class="item2" @click="chooseImage(3)" :src="marketers.shopELicense"  >
        </uni-forms-item>
<!--        <uni-forms-item class="item1" label="状态" name="status" required>
          <uni-data-checkbox v-model="marketers.status" :localdata="sexs"  />
        </uni-forms-item>-->
      </uni-forms>
      <el-dialog v-if="this.Echo=='2'">等待审核</el-dialog>
      <el-dialog v-else-if="this.Echo=='1'">申请未成功，请联系客服</el-dialog>
      <el-dialog v-else-if="this.Echo=='3'">审核成功，已开通店铺管理功能</el-dialog>
      <button type="primary"  @click="submit" :hidden="this.Echo == '3'">提交</button>
      <button type="primary" @click="submit1" v-if="this.Echo == '3'">我的店铺</button>
    </view>
  </view>
</template>
<script>
import { uploadAvatar, upload, submitMarketers , getMarketersProfile} from "@/api/system/marketers"

export default {
  data() {
    return {
      image:[],
      images: [],
      /*商家信息*/
      Echo: "2",
      marketers: {
        applyId: "",
        shopName: "",
        shopLogo: "",
        shopUser: "",
        mainProducts: "",
        shopUrl: "",
        shopAddress: "",
        shopIntroduction: "",
        bankAccountName: "",
        bankAccount: "",
        subBranch: "",
        lineNumber: "",
        legalPersonName: "",
        legalPersonDocument: "",
        legalPersonImage: "",
        corporateName: "",
        corporateUrl: "",
        corporateAddress: "",
        corporateCount: "",
        corporatePhone: "",
        registeredCapital: "",
        contactName: "",
        contactPhone: "",
        contactEmail: "",
        licenseNumber: "",
        businessScope: "",
        shopELicense: "",
        status: ""
      },
      sexs: [
        {
          text: '未审核',
          value: "0"
        }, {
          text: '未通过',
          value: "1"
        },
        {
          text: '通过',
          value: "2"
        }],
      rules: {
        nickName: {
          rules: [{
            required: true,
            errorMessage: '用户昵称不能为空'
          }]
        },
        phonenumber: {
          rules: [{
            required: true,
            errorMessage: '手机号码不能为空'
          }, {
            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
            errorMessage: '请输入正确的手机号码'
          }]
        },
        email: {
          rules: [{
            required: true,
            errorMessage: '邮箱地址不能为空'
          }, {
            format: 'email',
            errorMessage: '请输入正确的邮箱地址'
          }]
        }
      }
    }
  },
  onLoad() {
    this.marketers.applyId = this.$store.state.user.userId;
    this.getMarketers()
  },
  onReady() {
    this.$refs.form.setRules(this.rules)
  },
  methods: {

    chooseImage(id) {
      uni.chooseImage({
        count: 1,
        sizeType: ['original', 'compressed'],
        sourceType: ['album'],
        success: (res) => {
          if (id===1){
            this.marketers.shopLogo = res.tempFiles[0].path;
            let data = {name: 'file', filePath: this.marketers.shopLogo}
            uploadAvatar(data).then(response => {
              if (response.data!= {}){
                this.marketers.shopLogo = response.data.url
              }
            })
          }else if (id===2){
            this.marketers.legalPersonImage = res.tempFiles[0].path;
            let data = {name: 'file', filePath: this.marketers.legalPersonImage}
            uploadAvatar(data).then(response => {
              if (response.data!= {}){
                this.marketers.legalPersonImage = response.data.url
              }
            })
          }else {
            this.marketers.shopELicense = res.tempFiles[0].path;
            let data = {name: 'file', filePath: this.marketers.shopELicense}
            uploadAvatar(data).then(response => {
              if (response.data!= {}){
                this.marketers.shopELicense = response.data.url
              }
            })
          }
        },
        fail: (err) => {
          console.log(err.errMsg);
        }
      });
    },
    uploadImages() {
      for (let i = 0; i < this.images.length; i++) {
        uni.uploadFile({
          url: 'http://example.com/upload',
          filePath: this.images[i],
          name: 'file',
          success: (uploadRes) => {
            console.log('第' + (i + 1) + '张图片上传成功');
            console.log(uploadRes.data);
          },
          fail: (err) => {
            console.log('第' + (i + 1) + '张图片上传失败');
            console.log(err.errMsg);
          }
        });
      }
    },
    getMarketers() {
      console.log(JSON.stringify(this.$store.state.user.userId))
      getMarketersProfile(this.$store.state.user.userId).then(response => {
        if (!response.data || response.data.status==0){
          this.Echo = "2";
          while (response.data){
            this.marketers = response.data;
            break;
          }
        }else if (response.data && response.data.status==1){
          this.Echo = "1";
        }else {
          this.Echo = "3";
        }
      })
    },
    submit1(){
      uni.navigateTo({
        url: '/pages/marketers/Store_Management'
      })
    },
    submit(ref) {
      this.$refs.form.validate().then(res => {
        submitMarketers(this.marketers).then(response => {
          this.$modal.msgSuccess("入驻成功")
        })
      })
      uni.navigateBack();
    }
  }
}
</script>

<style lang="scss">
page {
  background-color: #ffffff;
}

.example {
  padding: 15px;
  background-color: #fff;
}

.segmented-control {
  margin-bottom: 15px;
}

.button-group {
  margin-top: 15px;
  display: flex;
  justify-content: space-around;
}

.form-item {
  display: flex;
  align-items: center;
  flex: 1;
}

.button {
  display: flex;
  align-items: center;
  height: 35px;
  line-height: 35px;
  margin-left: 10px;
}
.item1{
  /*width: 50%;*/
  /*margin-left: 30%;*/
}
.item2{

  width: 120px;
  height: 120px;
  /*margin-left: 50%;*/
  border: 1px solid;
}
.readonly{
  disable:true;
}
</style>
